import React from "react";
import { withRouter } from "react-router";
import { NavBar, Icon } from "antd-mobile";

// 导入props校验包
import PropTypes from 'prop-types'

// import './index.scss'

import styles from './index.module.css'

// 需要用withRouter对navheader组件进行包裹,使得其可以获取history等属性对象
function NavHeader({children, history, onLeftClick, className, rightContent}) {
  // 默认点击事件
  const defaultLeftClick = () => {history.go(-1)}

  return (
    <NavBar
      className={[styles.navBar, className || ''].join(' ')}
      mode="light"
      icon={<Icon type="left" />}
      onLeftClick={onLeftClick || defaultLeftClick}
      rightContent={rightContent}
    >
      {children}
    </NavBar>
  )
}

// 添加props校验
NavHeader.propTypes = {
  children: PropTypes.string,
  onLeftClick: PropTypes.func,
  className: PropTypes.string,
}

export default withRouter(NavHeader)